import React, { useEffect, Fragment } from 'react';
import { connect } from 'umi';
import MetaTags from 'react-meta-tags';
import styles from './index.less';

import Card from './components/Card';
import Text from './components/Text';
import FollowVV from './components/FollowVV';

const BusinessCard = ({ dispatch, userInfo }) => {
    const user = userInfo.userData;
    const getRequest = () => {
        let strs = '';
        // eslint-disable-next-line no-restricted-globals
        const url = location.search; // 获取url中"?"符后的字串
        if (url.indexOf('?') !== -1) {
            // 判断是否有参数
            const str = url.substr(1); // 从第一个字符开始 因为第0个是?号 获取所有除问号的所有符串
            strs = str.split('='); // 用等号进行分隔 （因为知道只有一个参数 所以直接用等号进分隔 如果有多个参数 要用&号分隔 再用等号进行分隔）
        }
        return strs[1];
    };
    const getUserInfo = () => {
        const obj = {
            paramAfterEncrypt: getRequest()
        };
        dispatch({
            type: 'userInfo/getbusinesscard',
            payload: obj
        });
    };
    useEffect(() => {
        getUserInfo();
    }, []);
    const renderCard = () => {
        if (!user) return null;
        if (user.serviceStatus === 6) return <div className={styles.resign}>该员工已离职</div>;
        return (
            <>
                <p className={styles.myCard_p}>您好，这是我的名片，请惠存</p>
                <Card user={user} />
            </>
        );
    };
    return (
        <Fragment>
            <MetaTags>
                <title>微微科技官网</title>
                <meta name="keywords" content="微微科技官网" />
                <meta name="description" content="微微科技官网" />
                <meta
                    name="viewport"
                    content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"
                />
            </MetaTags>
            <div className={styles.vv_profile}>
                {renderCard()}
                <Text user={user} />
                {user ? <FollowVV user={user} /> : ''}
            </div>
        </Fragment>
    );
};

export default connect(({ userInfo }) => ({
    userInfo
}))(BusinessCard);
